<!--
 @Author: libing/makeup1122
 @Email: makeup1123@163.com
 @Date: "2020-04-03 20:39:46"
-->
<template>
  <div>
    <TreeSelect
    :multiple="multiple"
    :return-object="returnObject"
    :value="value"
    @input="inputHandle"
    :items="items"
    label="栏目分类"
    :loading="loading"
    v-bind="$attrs">
    <template v-slot:append-outer>
      <slot></slot>
    </template>
    </TreeSelect>
  </div>
</template>
<script>
import { fetchTreeData } from '@/api/admin/category.js'
export default {
  name: 'CategorySelect',
  props: {
    value: [Number, Object, Array],
    returnObject: {
      type: Boolean,
      default: false
    },
    multiple: {
      type: Boolean,
      default: false
    }
  },
  components: {
    TreeSelect: () => import('@/components/Form/TreeSelect.vue')
  },
  data: function () {
    return {
      loading: false,
      items: []
    }
  },
  created: function () {
    this.loading = true
    fetchTreeData().then(res => {
      this.items = res.data.map(e => {
        e.disabled = (e.status === 'disabled' || e.redirect === 'yes')
        return e
      })
    }).finally(() => {
      this.loading = false
    })
  },
  methods: {
    inputHandle: function(e) {
      this.$emit('input', e)
    }
  }
}
</script>
<style scoped>
</style>
